<extend name="./Application/Common/View/block/base.php" />
<block name="header">
    <include file="./Application/Admin/View/block/easyui_header.php" />
    <link rel="stylesheet" type="text/css" href="/Public/uploadfy/uploadify.css" />
    <script type="text/javascript" src="/Public/uploadfy/jquery.uploadify.min.js"></script>
    <script src="__PUBLIC__/echarts/echarts.min.js"></script>
    <style>
        #dg{
            height: 100%;;
        }
        .text_valy td{
            line-height: 30px;
            /*border: 1px solid #000000;*/
        }
    </style>
</block>
<block name="bdoy">
    <body>
    <div class="easyui-layout" fit="true" id="cc">
        <div data-options="region:'south',split:true" style="height:230px;" id="charts_p" class="easyui-panel">
            <div class="easyui-layout" data-options="fit:true" id="ccc">
                <div data-options="region:'east',split:true,border:false" style="width:150px">
                    <div id="listDialog" class="easyui-window" title="统计查看" closed="true" modal="true" style="width: 1040px;height: 500px;">
                        <iframe id="count_iframe" style="width: 1040px;height: 500px;"></iframe>
                    </div>
                    <div class="easyui-panel" title="对比统计">
                        <table>
                            <tr>
                                <td>
                                    <a id="mut_bz_same_time" href="#" class="easyui-linkbutton" iconCls="icon-search">不同时间对比</a>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <a id="mut_bz" href="#" class="easyui-linkbutton" iconCls="icon-search">不同调蓄池对比</a>
                                </td>
                            </tr>
                        </table>
                    </div>
                </div>
                <div data-options="region:'center',border:false,fit:true">
                    <div id="main_charts" style="width: 1000px;height:230px;"></div>
                </div>
            </div>
        </div>
        <div data-options="region:'east',split:true" style="width:250px;">
            <div class="easyui-panel" title="统计信息(单位：立方米)">
                <div id="loading" class="panel-loading" style="display: none;">正在加载，请稍等...</div>
                <table class="text_valy" id="text_valy" cellspacing="0" style="display: none;">
                    <tr>
                        <td align="right">
                            昨日总抽排量：
                        </td>
                        <td id="yestoday_flow">

                        </td>
                    </tr>
                    <tr>
                        <td align="right">
                            当前总抽排量：
                        </td>
                        <td id="today_flow">

                        </td>
                    </tr>
                    <tr>
                        <td align="right">
                            当前污水总抽排量：
                        </td>
                        <td id="today_ws_flow">

                        </td>
                    </tr>
                    <tr>
                        <td align="right">
                            当前雨水总抽排量：
                        </td>
                        <td id="today_ys_flow">

                        </td>
                    </tr>
                    <tr>
                        <td align="right">
                            查询总抽排量：
                        </td>
                        <td id="query_flow">

                        </td>
                    </tr>
                    <tr>
                        <td align="right">
                            查询污水总抽排量：
                        </td>
                        <td id="queryws_flow">

                        </td>
                    </tr>
                    <tr>
                        <td align="right">
                            查询雨水总抽排量：
                        </td>
                        <td id="query_ys_flow">

                        </td>
                    </tr>
                </table>
            </div>
        </div>
        <div data-options="region:'center'">
            <table id="dg"></table>
            <div id="grid_ToolBar" style="padding:5px;height:auto">
                <div id="queryParamZone">
                    <form id="queryForm_gen" method="post" action="">
                        <table>
                            <tr>
                                <td>调蓄池</td>
                                <td><input id="ps_id_combox"></td>
                                <td>泵机</td>
                                <td><select id="p_id" style="width: 100px;"></select></td>
                                <td>类型</td>
                                <td>
                                    <select name="p_type" id="p_type" data-options="prompt:'{:LANG('pls_input')}'" style="width: 80px;">
                                        {:csdt_pump_type_option()}
                                    </select>
                                </td>
                                <td>从</td>
                                <td>
                                    <input class="easyui-datetimebox" id="gen_start" name="start" style="width: 150px;" editable="false" value="{:date('Y-m-d').' 00:00:00'}">
                                </td>
                                <td>至</td>
                                <td>
                                    <input class="easyui-datetimebox" id="gen_end" name="end" style="width: 150px;" editable="false" value="{:date('Y-m-d H:i:s')}">
                                </td>
                                <td><a id="btnQuery_gen" href="#" class="easyui-linkbutton" iconCls="icon-search">查询</a></td>
                                <!--                                <td><a href="#" class="easyui-linkbutton" iconCls="icon-undo" onclick="javascript:$('#queryForm_gen').form('clear');">重置</a></td>-->
                            </tr>

                        </table>
                        <table>
                            <tr>
                                <td>
                                    <div id="search_tag_content"></div>
                                </td>
                            </tr>
                        </table>
                    </form>
                </div>
            </div>
        </div>
    </div>
    </body>
</block>
<block name="footExtendJs">
    <script>
        var now_datetime = getNowFormatDate();
        $(function(){
            $('#ps_id_combox').combobox({
                url:'/Manage/AdminCsdt/get_all_combox',
                valueField:'id',
                textField:'name',
                width:120,
                multiple:true,
                prompt:'支持多选',
                onSelect: function (record){
                    var text = record.name;
                    if(record.name=='全部'){
                        text = '全部调蓄池';
                    }
                    create_search_tag(text, 'ps_id', record.id);
                    $('#p_id').combobox('clear');
                    $('#p_id').combobox('reload','/Manage/AdminCsdtPump/get_all_pump?ps_id='+get_search_tag_ids('ps_id'));
                    $(this).combobox('clear');
                    $('#dg').datagrid('resize');
                }
            });
            $('#p_id').combobox({
                url:'/Manage/AdminCsdtPump/get_all_pump?ps_id=',
                valueField:'id',
                textField:'p_number',
                width:80,
                multiple:true,
                prompt:'支持多选',
                onSelect: function (record){
                    var text = record.p_number;
                    if(record.p_number=='全部'){
                        text = '全部泵机';
                    }
                    create_search_tag(text, 'f_id', record.id);
                    $(this).combobox('clear');
                    $('#dg').datagrid('resize');
                }
            });
            var request_url = '__URL__/get_all?now_datetime='+now_datetime;
            jQuery('#dg').datagrid({
                fit:true,
                nowrap: false,
                striped: true,
                collapsible:false,
                url:request_url,
                method:'get',
                pageNumber:1,
                pageSize:20,
                pageList:[20,50,100,200],
                idField:'id',
                remoteSort: false,
                sortOrder:'desc',
                columns:[[
                    {field:'sta_name',title:'调蓄池名称', width:180,align:'center'},
                    {field:'p_number',title:'泵机编号', width:120,align:'center'},
                    {field:'p_type',title:'泵机类型', width:80,align:'center'},
                    {field:'p_flow_meas',title:'单机抽排量<br>(m³/h)', width:80,align:'center'},
                    {field:'status_text',title:'设备状态', width:80,align:'center'},
                    {field:'today_flow',title:'今日泵机抽排量<br>(m³)', width:100,align:'center'},
                    {field:'yes_flow',title:'昨日调蓄池总抽排量<br>(m³)', width:100,align:'center'},
                    {field:'total_flow',title:'今日调蓄池总抽排量<br>(m³)', width:100,align:'center'},
                    {field:'query_flow_bj',title:'查询泵机抽排量<br>(m³)', width:100,align:'center'},
                    {field:'query_flow',title:'查询调蓄池抽排量<br>(m³)', width:100,align:'center'},
                ]],
                pagination:true,
                rownumbers:true,
                singleSelect:false,
                toolbar: '#grid_ToolBar',
                onLoadSuccess: function(data) {
                    set_main_charts();
                    get_text_valy();
                    var rows = data.rows;
                    var temp_row = rows[0];
                    var rowspan = 1;
                    var need_merg = false;
                    for (var i = 0; i < rows.length; i++) {
                        var this_row = rows[i];
                        for (var j = i+1; j < rows.length; j++){
                            if(this_row.ps_id == rows[j].ps_id){
                                need_merg = true;
                                rowspan++;
                            }
                        }
                        if(need_merg){
                            $(this).datagrid('mergeCells', {
                                index: i,
                                field: 'query_flow',
                                rowspan: rowspan
                            });
                            $(this).datagrid('mergeCells', {
                                index: i,
                                field: 'yes_flow',
                                rowspan: rowspan
                            });
                            $(this).datagrid('mergeCells', {
                                index: i,
                                field: 'total_flow',
                                rowspan: rowspan
                            });
							$(this).datagrid('mergeCells', {
                                index: i,
                                field: 'sta_name',
                                rowspan: rowspan
                            });
                            rowspan = 1;
                            need_merg = false;
                        }
                    }

                }
            });
            $('#reload_button').click(function(){
                $('#dg').datagrid('load', {});
            });
            $('#btnQuery_gen').click(function() {
                query_fy_form();
            });
            $('#mut_bz_same_time').click(function() {
                $('#listDialog').window('open');
                $('#count_iframe').attr('src', '__URL__/mut_bz_same_time')
            });
            $('#mut_bz').click(function() {
                $('#listDialog').window('open');
                $('#count_iframe').attr('src', '__URL__/mut_bz')
            });


        });

        function query_fy_form(){
            now_datetime = getNowFormatDate();
            $('#dg').datagrid('resize');
            var obj = $('#queryForm_gen').serializeJson();
            obj['ps_id'] = get_search_tag_ids('ps_id');
            obj['f_id'] = get_search_tag_ids('f_id');
            obj['gen'] = '1';
            obj['now_datetime'] = now_datetime;
            $('#dg').datagrid('load',obj);
            get_text_valy();
        }

        function get_text_valy(){
            $('#text_valy').hide();
            $('#loading').show();
            var start = $('#gen_start').combo('getValue');
            var end = $('#gen_end').combo('getValue');
            var url = '__URL__/get_text_query';
            var ps_id = get_search_tag_ids('ps_id');
            var f_id = get_search_tag_ids('f_id');
            var data = {'start':start,'end':end,'ps_id':ps_id, 'f_id':f_id, 'now_datetime':now_datetime};
            $.post(url, data, function(json){
                var obj = eval('(' + json + ')');
                $('#yestoday_flow').text(obj.yestoday_flow);
                $('#today_flow').text(obj.today_flow);
                $('#today_ys_flow').text(obj.today_ys_flow);
                $('#today_ws_flow').text(obj.today_ws_flow);
                $('#query_flow').text(obj.query_flow);
                $('#query_ys_flow').text(obj.query_ys_flow);
                $('#queryws_flow').text(obj.queryws_flow);
                $('#loading').hide();
                $('#text_valy').show();
            });
        }

        function set_main_charts(){
//            ajaxLoading();
            setHeight();
            var myChart = echarts.init(document.getElementById('main_charts'));
            myChart.showLoading({text: '正在加载，请稍后....',});
            var url = '__URL__/query_today_bz_charts_line';
            $.getJSON(url, function(json){
                myChart.setOption(json);
                myChart.hideLoading();
//                ajaxLoadEnd();
            });
        }

        function setHeight(){

        }

        function getNowFormatDate() {
            var date = new Date();
            var seperator1 = "-";
            var seperator2 = ":";
            var month = date.getMonth() + 1;
            var strDate = date.getDate();
            if(month >= 1 && month <= 9) {
                month = "0" + month;
            }
            if(strDate >= 0 && strDate <= 9) {
                strDate = "0" + strDate;
            }
            var hour = date.getHours();
            var min = date.getMinutes();
            var sec = date.getSeconds();
            if(date.getHours()<10){
                hour = '0'+hour;
            }
            if(date.getMinutes()<10){
                min = '0'+min;
            }
            if(date.getSeconds()<10){
                sec = '0'+sec;
            }
            var currentdate = date.getFullYear() + seperator1 + month + seperator1 + strDate +
                " " + hour + seperator2 + min +
                seperator2 + sec;
            return currentdate;
        }
    </script>
</block>